<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Registro</title>
<style type='text/css'>
form {
	width: 400px;
}

form ul {
	list-style-type: none;
}

form ul li {
	margin: 15px 0;
}

form label {
	display: block;
	font-size: 1em;
}

form input {
	font-size: 1em;
	padding: 5px;
	border: #ccc 3px solid;
	width: 100%;
}
</style>

<script>
	function validate(form){
		fail = validateUser(form.name.value,1);
		fail += validatePassword(form.pass.value);
		fail += validateUser(form.nombre.value,2);
		fail += validateUser(form.apellido.value,3);		
		fail += validatePasswordEqual(form.pass.value,form.pass2.value);
		if (fail =="") return true;
		else {
			alert(fail);
			return false;
		}
	}
	
	function validateUser(field,tipo) {
		if (field=="") { 
			switch(tipo) {
			case 1:
				return "El campo Usuario esta vacio.\n";
				break;
				
			case 2:
				return "El campo Nombre esta vacio.\n";
				break;
				
			case 3:
				return "El campo Apellido esta vacio.\n";
				break;
				
				default:
					return "Un campo esta vacio.\n";
				break;
			}	
			
		}
		return "";
	}
	
	function validatePassword(field){
		if(field == "") return "Introduce una contraseña.\n";
		else
			if (field.length < 5)
				return "El tamaño de la contraseña debe ser por lo menos de 5 caracteres.\n";
			else 
				if (! /[a-z]/.test(field) || ! /[0-9]/.test(field))
					return "La contraseña requiere por lo menos un caracter de [a-z] y [0-9].\n";					
		return "";		
	}
		
	function validatePasswordEqual(field,field2) {
		if(field !=field2) return "Las contraseñas no son iguales.\n";
		return "";
	}
</script>


</head>

<body>

	Página de registro de Capturistas
	<br />
	<!-- Registro -->
	<form action="regCapturista.php" method="post" onsubmit="return validate(this)">
		<ul>
			<li><label for="name"> Nombre: </label> <input type="text"
				name="name" size="20" id="nombre" /></li>
				
			<li><label for="name"> Apellido Paterno: </label> <input type="text"
				name="apellido" size="20" id="apellido" /></li>			
		
			<li><label for="name"> Usuario: </label> <input type="text"
				name="user" size="20" id="name" /></li>

			<li><label for="name"> Contraseña:</label> <input
				type="password" name="pass" size="20" id="pass" /></li>

			<li><label for="name">Repite la Contraseña:</label> <input
				type="password" name="pass2" size="20" id="pass2" /></li>

			<li><input type="submit" value="Registrar" /></li>
		</ul>
	</form>
	<!-- END OF Registro -->
</body>
</html>
